<!doctype html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>APP</title>
    <link rel="stylesheet" href="../../css/api.css" />
    <link rel="stylesheet" href="../../css/aui.css" />
    <link rel="stylesheet" href="../../css/common.css" />
    <link rel="stylesheet" href="../../css/home.css">
    <link rel="stylesheet" href="../../css/font/iconfont.css">
</head>

<body>
    <div id="wrap">
        <div>
            <div class="top">
                <div id="header" class="header homehead">
                    <div class="left"><a href="#"><i class="icon iconfont icon-bianji1"></i></a></div>
                    <div class="center">
                      <p>
                        <input class="search_box" type="text" placeholder="请输入置换品名称">
                      </p>
                    </div>
                    <div class="right">
                      <a><i class="icon iconfont icon-xiaoxi2"></i></a>
                      <span>2</span>
                    </div>
                </div>

                <!-- 轮播图 -->
                <div id='slider' class='swipe'>
                    <div class='swipe-wrap'>
                        <div class="swipe-box" tapmode="tap-active" data-url="" data-title="新书" onclick="toDetail(this);">
                            <img src="../../image/index_ad_1.jpg" alt="全球知名大牌特卖汇">
                        </div>
                        <div class="swipe-box" tapmode="tap-active" data-url="" data-title="新书" onclick="toDetail(this);">
                            <img src="../../image/index_ad_2.jpg" alt="君御灯饰特惠日！">
                        </div>
                        <div class="swipe-box" tapmode="tap-active" data-url="" data-title="新书" onclick="toDetail(this);">
                            <img src="../../image/index_ad_3.jpg" alt="宇宙最萌面膜专场">
                        </div>
                        <div class="swipe-box" tapmode="tap-active" data-url="" data-title="新书" onclick="toDetail(this);">
                            <img src="../../image/index_ad_4.jpg" alt="狂欢延续，999送黄金">
                        </div>
                        <div class="swipe-box" tapmode="tap-active" data-url="" data-title="新书" onclick="toDetail(this);">
                            <img src="../../image/index_ad_5.jpg" alt="儿童户外运动一站购">
                        </div>
                    </div>
                    <div id="title-box">
                        <ul id="title-box-ul">
                            <li class="active"></li>
                            <li></li>
                            <li></li>
                            <li></li>
                            <li></li>
                        </ul>
                    </div>
                </div>
                <!-- 轮播图 end -->
            </div>
            <!-- 上方导航栏 -->
            <div id="nav_top">
                <ul class="nav_top_list">
                    <li class="nav_top_li score" tapmode="tap-active" onclick="toBType(1)" data-url="" data-title="">
                        <i class="icon01"><img src="../../icon/icon01.png"></i>
                        <span class="text">家居生活</span>
                    </li>
                    <li class="nav_top_li recharge" tapmode="tap-active" onclick="toBType(2)" data-url="" data-title="">
                        <i class="icon01"><img src="../../icon/icon02.png"></i>
                        <span class="text">电子器械</span>
                    </li>
                    <li class="nav_top_li lottery" tapmode="tap-active" onclick="toBType(3)" data-url="" data-title="">
                        <i class="icon01"><img src="../../icon/icon03.png"></i>
                        <span class="text">装潢家居</span>
                    </li>
                    <li class="nav_top_li ju" tapmode="tap-active" onclick="toBType(4)" data-url="" data-title="">
                        <i class="icon01"><img src="../../icon/icon04.png"></i>
                        <span class="text">食品保健</span>
                    </li>
                    <li class="nav_top_li ju" tapmode="tap-active" onclick="toBType(5)" data-url="" data-title="">
                        <i class="icon01"><img src="../../icon/icon05.png"></i>
                        <span class="text">商业服务</span>
                    </li>
                    <li class="nav_top_li ju" tapmode="tap-active" onclick="toBType(6)" data-url="" data-title="">
                        <i class="icon01"><img src="../../icon/icon06.png"></i>
                        <span class="text">固定资产</span>
                    </li>
                </ul>
            </div>
            <!-- 上方导航栏 end-->
            <div class="container">
                <!--热门置换-->
                <div class="aui-hr"></div>
                <div class="more">
                  <div class="reload_header">
                      <span class="title">热门置换</span>
                      <span class="reload" tapmode="tap-active" onclick="toGoodsList(0, '')">
                          <i class="reload_icon"></i>更多
                      </span>
                  </div>
                  <!-- <div class="aui-hr"></div> -->
                    <div id="hot" class="clearfix">

                        <!-- <div class="more_unit sp1_2" tapmode="tap-active" data-url="" data-title="">
                            <div class="img_box">
                                <img src="../../image/index_img_m1.png" alt="">
                            </div>
                            <div class="reload_detail">
                                <p class="reload_p1">产品主标题显示位置</p>
                                <p class="reload_p2">一级会员</p>
                                <p class="reload_p3">数量：<span>500</span>件</p>
                                <p class="reload_p4">估值：<span>1800.00</span></p>
                            </div>
                        </div> -->

                    </div>
                </div>
                <!--置换品-->
                <div class="more">
                    <div class="sp1 reload_header">
                        <span class="title">置换品</span>
                        <span class="reload" tapmode="tap-active" onclick="toGoodsList(0, '')">
                            <i class="reload_icon"></i>更多
                        </span>
                    </div>
                    <div id="goods" class="clearfix">
                        <!-- <div class="more_unit sp1_2" tapmode="tap-active" data-url="" data-title="">
                            <div class="img_box">
                                <img src="../../image/index_img_m1.png" alt="">
                            </div>
                            <div class="reload_detail">
                                <p class="reload_p1">产品主标题显示位置</p>
                                <p class="reload_p2">一级会员</p>
                                <p class="reload_p3">数量：<span>500</span>件</p>
                                <p class="reload_p4">估值：<span>1800.00</span></p>
                            </div>
                        </div> -->
                    </div>
                </div>
            </div>
        </div>
    </div>
</body>
<script src="../../script/api.js"></script>
<script src="../../script/zepto.js"></script>
<script src="../../script/swipe.js"></script>
<script src="../../script/common.js"></script>
<script src="../../script/imgSit.js"></script>
<script src="../../script/base.js"></script>
<script>
    var getIndexData = function() {
        showProgress()

        $.ajax({
            url: "http://www.aiyi5.com/getIndexDataForApp",
            type: "POST",
            dataType: 'json',
            error: function(errorMsg) {},
            success: function(data) {
                $('#hot').empty();
                $.each(data.hots, function(n, v) {
                    var temp = '<div class="more_unit sp1_2" tapmode="tap-active" onclick="openGoods(' + v.id + ')">';
                    temp += '<div class="img_box"><img src="http://www.aiyi5.com/resource/goods/' + v.img + '" alt=""></div>';
                    temp += '<div class="reload_detail">';
                    temp += '<p class="reload_p1">' + v.name + '</p>';
                    temp += '<p class="reload_p2">' + !v.level ? '非会员' : v.level + '</p>';
                    temp += '<p class="reload_p3">数量：<span>' + v.amount + '</span></p>';
                    temp += '<p class="reload_p4">估值：<span>' + v.val + '</span></p></div></div>';
                    $('#hot').append(temp);
                });

                $('#goods').empty();
                $.each(data.goods, function(n, v) {
                    var temp = '<div class="more_unit sp1_2" tapmode="tap-active" onclick="openGoods(' + v.id + ')">';
                    temp += '<div class="img_box"><img src="http://www.aiyi5.com/resource/goods/' + v.img + '" onload="scalingImg(this)" alt=""></div>';
                    temp += '<div class="reload_detail">';
                    temp += '<p class="reload_p1">' + v.name + '</p>';
                    temp += '<p class="reload_p2">' + !v.level ? '非会员' : v.level + '</p>';
                    temp += '<p class="reload_p3">数量：<span>' + v.amount + '</span></p>';
                    temp += '<p class="reload_p4">估值：<span>' + v.val + '</span></p></div></div>';
                    $('#goods').append(temp);
                });

                hideProgress();
            }
        });
    }

    apiready = function() {
            getIndexData();

            api.addEventListener({
                name: 'swipedown'
            }, function(ret, err) {
                if (ret) {
                    t = $api.dom("#main").scrollTop();
                    if (t > 10) {
                        $api.dom("#header").removeCls("homehead");
                    }
                } else {
                    /*alert( JSON.stringify( err ) );*/
                }
            });
            Zepto(function($) {
                var aLi = $('#title-box-ul li');
                window.mySwipe = Swipe($api.byId('slider'), {
                    auto: 3000,
                    continuous: true,
                    callback: function(index, elem) {

                        var i = aLi.length;
                        while (i--) {
                            aLi[i].className = '';
                        }
                        aLi[index].className = 'active';
                        // var text = $(elem).find('img').attr('alt');
                        // act_title.text(text);
                    }
                });
                $('#slider .swipe-box').on('click', function(event) {

                });

            })
        }
        // apiready();
</script>

</html>
